<script src="lib/js/zepto.min.js"></script>
<script>
    Zepto(function ($) {
        //切换tab
        $(document).on("click", "[data-toggle='tab']", function () {
            var $this = $(this);
            $this.addClass("active").siblings().removeClass("active");
            var tar = $this.data("target");
            if (!tar || tar == "none") { return;}
            $(tar).addClass("active").siblings().removeClass("active");
        });

        //收藏按钮星星style切换
        $(document).on("click", ".goods-detail-title .icon4", function () {
            $(this).toggleClass("icon4-star2-gray").toggleClass("icon4-star2-green");
        });

        //collapse切换,暂无动画
        $(document).on("click","[data-toggle='collapse']", function () {
            var $this = $(this);
            var mama = $this.data("parent");
            var target = $this.data("target");
            var $article;
            var $bro;

            if (mama && mama!="none") {
                //假如有指定父容器
                $article = $this.parents(mama + ">*");
                $bro = $article.siblings();

                //切换周围节点
                $bro.find(".collapse.in").removeClass("in");
                //可选:切换箭头
                $bro.find(".icon4-up").removeClass("icon4-up").addClass("icon4-down");
            } else {
                //没有指定父容器,则不切换其他兄弟元素,并默认把自己的容器指向父article标签
                $article = $this.parents("article");
            }

            //切换自己
            $(target).toggleClass("in");
            //可选:切换箭头
            var thisIcon;
            if ($this.hasClass("icon4-up") || $this.hasClass("icon4-down")) {
                thisIcon = $this;
            } else {
                thisIcon = $this.find(".icon4-up")[0] || $this.find(".icon4-down")[0];
            }
            //var thisIcon = ($article.find(".icon4-up")[0] || $article.find(".icon4-down")[0]);
            $(thisIcon).toggleClass("icon4-up").toggleClass("icon4-down");

        });

        //开关按钮切换
        $(document).on("touchstart", "[data-toggle='switch']", function () {
            var $this = $(this);
            var $btn = $this.find(".yes-or-no");
            var val = $this.data("val");
            var target = $this.data("target");

            //切换为是
            if (val == "yes") {
                $(target).addClass("in");
                $this.data("val", "nope");
                $btn.removeClass("nope");
            }
            //切换为否
            else if (val == "nope") {
                $(target).removeClass("in");
                $this.data("val", "yes");
                $btn.addClass("nope");
            }
        });

        //相应下拉框
        $(document).on("click", "[data-toggle='dropdown']", function () {
            var tar = $(this).data("target");
            //openSelect($(tar));
            $(tar).trigger("mousedown");
            
        });

        //触发下拉框func
        function openSelect($elem) {
            if (document.createEvent) {
                var e = document.createEvent("MouseEvents");
                e.initMouseEvent("mousedown", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
                $elem[0].dispatchEvent(e);
            } else if (element.fireEvent) {
                $elem[0].fireEvent("onmousedown");
            }
        }
    });

</script>
